<!DOCTYPE html>
<html>
    <head>
        <title>注册</title>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
        <link rel="stylesheet" href="/css/music/top.css">
        <link rel="stylesheet" href="/css/music/bottom.css">
        <link rel="stylesheet" href="/css/music/register.css">
    </head>
    <body>
    <!-- 中间部分开始 -->
    <div style="width:70%;">
        <div style="width:59.5%; height:500px; border:1px solid #84DBFF; float:left;">
            <!-- toubu -->
            <div style="width:100%; height:20px; float:left;">
                <img src="../image/img/icon.gif"/>
                <span style="color:#C0C0C0; font-size:18px; font-weight:bold;">欢迎注册爱音乐</span>
            </div>
            <div>&nbsp;</div>
            <div>&nbsp;</div>
            <div>&nbsp;</div>
            <!--表格div-->
            <div id="reg-tab" style="width:100%; height:350px; ">
                <form action="/music/user/registFrom.do" method="post">
                    <table id="re_tabb" border="0" cellpadding="0" cellspacing="0" width="580" height="380">
                        <tr style="height:5px;">
                            <td colspan="3">
                                <hr width="80%" style="border:1px dotted #CCCCCC"/>
                            </td>
                        </tr>
                        <tr style="border-bottom:1px solid red;">
                            <td style="font-size:13px;text-align:right;width:120px;">用户名：</td>
                            <td width="200"><input type="text" name="user_name" id="r_uname"></td>
                            <td id="unameEror" style="width:230px;"></td>
                        </tr>
                        <tr style="height:5px;">
                            <td colspan="3">
                                <hr width="80%" style="border:1px dotted #CCCCCC"/>
                            </td>
                        </tr>
                        <tr>
                            <td style="font-size:13px;text-align:right;width:120px;">密码：</td>
                            <td><input type="password" name="password" id="r_psw"></td>
                            <td id="pwdEror"></td>
                        </tr>
                        <tr style="height:5px;">
                            <td colspan="3">
                                <hr width="80%" style="border:1px dotted #CCCCCC"/>
                            </td>
                        </tr>
                        <tr>
                            <td style="font-size:13px;text-align:right;width:120px;">确认密码：</td>
                            <td width="200"><input type="password" name="password2" id="r_psw2"></td>
                            <td id="pwdEror2"></td>
                        </tr>
                        <tr style="height:5px;">
                            <td colspan="3">
                                <hr width="80%" style="border:1px dotted #CCCCCC"/>
                            </td>
                        </tr>
                        <tr>
                            <td style="font-size:13px;text-align:right;width:120px;">常用邮箱：</td>
                            <td><input type="text" name="email" id="r_mail"></td>
                            <td id="mailEror"></td>
                        </tr>
                        <tr style="height:5px;">
                            <td colspan="3">
                                <hr width="80%" style="border:1px dotted #CCCCCC"/>
                            </td>
                        </tr>
                        <tr>
                            <td style="font-size:13px;text-align:right;width:120px;">手机号：</td>
                            <td><input type="text" name="phone" id="r_phone" style="float:left;width:150px;"><input
                                    type="button" value="验证码" style="float:left; width:50px; cursor:hand;"/></td>
                            <td id="phoneEror"></td>
                        </tr>
                        <tr style="height:5px;">
                            <td colspan="3">
                                <hr width="80%" style="border:1px dotted #CCCCCC"/>
                            </td>
                        </tr>
                        <tr>
                            <td style="font-size:13px;text-align:right;width:120px;">性别：</td>
                            <td colspan="2">
                                <input type="radio" name="sex" value="男" id="sex" checked="checked"
                                       style="width: 30px; border: 0px;">男
                                <input type="radio" name="sex" value="女" id="sex" style="width: 30px; border: 0px;">女
                            </td>
                        </tr>
                        <tr style="height:5px;">
                            <td colspan="3">
                                <hr width="80%" style="border:1px dotted #CCCCCC"/>
                            </td>
                        </tr>
                        <tr height="150px">
                            <td style="font-size:13px;text-align:right;width:120px;">头像：</td>
                            <td style="border:#FFF solid 1px;">
                                <div id="showhead">
                                    <div id="showheadimg">头像预览</div>
                                </div>
                                <input type="button" value="选择头像" class="choose_btn" id="showImgBtn"
                                       style="cursor:hand; padding-left:20px; "/>
                            </td>
                            <!--选择头像-->
                            <td style="position: relative">
                                <div id="h_img">
                                    <!-- <c:forEach begin="1" end="15" step="1" varStatus="status">
                                        <div id="d${status.index }" onMouseDown="show_img(${status.index })" onmouseover="showfilter('d${status.index }')" onmouseout="hiddenFikter('d${status.index }')">
                                         <img src="image/user/${status.index }.gif" style="width:40px; height:45px; float: left;">
                                       </div>
                                    </c:forEach> -->
                                </div>
                            </td>
                        </tr>
                        <tr style="height:5px;">
                            <td colspan="3">
                                <hr width="80%" style="border:1px dotted #CCCCCC"/>
                            </td>
                        </tr>
                        <tr style="height:50px;">
                            <td colspan="3">
                                <div id="r-agreeck" style="text-align:center; font-size:12px;">
                                    <input type="checkbox" name="ck" id="r_ck" style="width: 20px; border: 0px;">
                                    我已阅读并同意《爱音乐网站用户注册协议》&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                </div>
                            </td>
                        </tr>
                        <tr style="height:5px;">
                            <td colspan="3">
                                <hr width="80%" style="border:1px dotted #CCCCCC"/>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="3">
                                <div style="text-align:center; margin-top:5px;">
                                    <input type="submit" name="sub" id="sub" value=""/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                    <input type="hidden" value="" name="head" id="r_hi">
                                    <input type="hidden" value="" name="user_id" id="r_hi_id">
                                </div>
                            </td>
                        </tr>

                    </table>
                </form>
            </div>
        </div>

        <div id="my_right">
            <div id="my_rtop">
                <img src="../image/img/my-t.jpg" style="width:50px; height:50px;"/>
                <span class="sp2">享心情&nbsp;&nbsp;&nbsp;&nbsp;爱音乐</span>
            </div>
            <!--
            <c:forEach begin="1" end="20" varStatus="status">
                <div id="my_pics">
                  <img src="image/img/my-index${status.index }.jpg" width="80" height="80"/>
                </div>
            </c:forEach> -->

        </div>
    </div>

    <div class="clear_both"></div>
    <!-- 中间部分结束 -->

    </body>
    <script src="/js/jquery.min.js"></script>
    <script src="/js/bootstrap.min.js"></script>
    <script src="/js/base.js"></script>
    <script src="/js/register.js"></script>
</html>
